<template>
  <el-collapse-item name="base">
    <template slot="title">
      <PartitionTitle title="异常基本信息"></PartitionTitle>
    </template >

    <el-form :model="abnormalData" ref="ruleForm" label-width="110px">
      <el-row type="flex">
        <el-col :span="8">
          <el-form-item label="异常名称">
            <el-input type="text" v-model="abnormalData.abnormalName" disabled></el-input>
          </el-form-item>
        </el-col>

        <el-col :span="8">
          <el-form-item label="异常分类">
            <el-input type="text" v-model="abnormalData.abnormalTypeName" disabled></el-input>
          </el-form-item>
        </el-col>

        <el-col :span="8">
          <el-form-item label="异常等级">
            <el-input type="text" v-model="abnormalData.abnormalLevelName" disabled></el-input>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row type="flex">
        <el-col :span="8">
          <el-form-item label="生成时间">
            <el-input type="text" v-model="abnormalData.buildDate" disabled></el-input>
          </el-form-item>
        </el-col>

        <el-col :span="8" v-if="abnormalData.closeDate">
          <el-form-item label="结束时间">
            <el-input type="text" v-model="abnormalData.closeDate" disabled></el-input>
          </el-form-item>
        </el-col>

        <el-col :span="8">
          <el-form-item label="处理时长">
            <el-input type="text" v-model="abnormalData.handleDate" :disabled='!(mode == "operate" && (abnormalData.status == 1 || abnormalData.status == 2))'></el-input>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row type="flex">
        <el-col :span="8">
          <el-form-item label="关联指标">
            <el-input type="text" v-model="abnormalData.indexName" disabled></el-input>
          </el-form-item>
        </el-col>

        <el-col :span="8">
          <el-form-item label="关联设备">
            <el-input type="text" v-model="abnormalData.equipmentName" disabled></el-input>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row type="flex">
        <el-col :span="8">
          <el-form-item label="所属工厂">
            <el-input type="text" v-model="abnormalData.factoryDeptName" disabled></el-input>
          </el-form-item>
        </el-col>

        <el-col :span="8">
          <el-form-item label="所属车间">
            <el-input type="text" v-model="abnormalData.workshopName" disabled></el-input>
          </el-form-item>
        </el-col>

        <el-col :span="8">
          <el-form-item label="所属产线">
            <el-input type="text" v-model="abnormalData.lineName" disabled></el-input>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row type="flex">
        <el-col :span="8">
          <el-form-item label="责任人">
            <el-input type="text" v-model="abnormalData.processedName" disabled></el-input>
          </el-form-item>
        </el-col>

        <template v-if='abnormalData.orderType'>
          <el-col :span="8">
            <el-form-item :label="abnormalData.orderType == 1 ? '上报人' : '下发人'">
              <el-input type="text" v-model="abnormalData.abnormalReportName" disabled></el-input>
            </el-form-item>
          </el-col>

          <el-col :span="8" v-if='abnormalData.orderType == 1'>
            <el-form-item label="审核人">
              <el-input type="text" v-model="abnormalData.abnormalCheckName" disabled></el-input>
            </el-form-item>
          </el-col>
        </template>
      </el-row>

      <el-row type="flex">
        <el-col :span="24">
          <el-form-item label="异常描述">
            <el-input
              disabled
              type="textarea"
              :autosize="{ minRows: 2}"
              v-model="abnormalData.abnormalDes">
            </el-input>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row type="flex">
        <el-col :span="24">
          <el-form-item label="附件">
            <template v-if='abnormalData.files && abnormalData.files.length'>
              <div class="text-value" v-for="item in abnormalData.files" :key='item.id'>
                <el-link type="primary" :underline="false" @click="preview(item)">{{item.fileName}}</el-link>
              </div>
            </template>
            <div v-else>-</div>
          </el-form-item>
        </el-col>
      </el-row>

    </el-form>
  </el-collapse-item>
</template>
<script>
  import axios from 'axios'
  import { getToken } from '@/utils/auth'
  import { downloadFile } from '@/utils/file'
  import { parseTime } from '@/utils/eam'
  import service from "../../../utils/request";
  import { GEN_SERVER } from '@/config/baseUrl'
export default {
  props:{
    abnormalData:{
      type:Object,
      default:()=>{}
    },
    mode:{
      type:String,
      default:""
    }
  },

  data() {
    return {

    };
  },

  methods:{
    preview(item){
      axios({
        baseURL:service.baseURL + GEN_SERVER['form-server'],
        url:'/refine/report/byte/down',
        method:"get",
        params:{id:item.id},
        headers: {Authorization:'Bearer ' + getToken()},
        responseType: 'blob'
      }).then(res => {
        let count = item.fileName.lastIndexOf(".");
        let fileName = item.fileName.slice(0,count);
        let suffix = item.fileName.slice(count);
        downloadFile(res.data,`${fileName}${parseTime(new Date(), '{y}{m}{d}')}${suffix}`)
        this.saveloading = false
      }).catch(() => {
        this.msgError("操作失败")
        this.saveloading = false
      })
    },
  }
};
</script>
<style lang="scss" scoped>
.block-title {
  margin-bottom: 0;
}
</style>
